<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>

<body>
    <script>
        function muti(num) {
            return new Promise(resolve => {
                setTimeout(() => {
                    resolve(num * num)
                }, 1000);
            })
        }

        const nums = [1, 2, 3]
        nums.forEach(async i => {
            const res = await muti(i)
            console.log(res);
        });

        // 效果是：1，4，9隔了1秒钟，同时打印出来
        // 因为forEach是同步的，遍历的时候不会等待，遍历的时候会一瞬间把所有数组中的内容遍历完，所以等待的时候也是同时的，所以同时打印出来

        // 如果想让它依次打印出来，则需要使用for...of
        (async function () {
            for (let i of nums) {
                const res = await muti(i)
                console.log(res);
            }
        })()

        // 运用在异步的场景之中
    </script>
</body>

</html>